﻿<!DOCTYPE html>
<html>
<head>
    <title data-i18n="bots-title">ASF | Bots</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script> <!--Change to cdnjs once available-->
    <link rel="icon" href="../img/favicon.png" type="image/png">
    <link rel="shortcut icon" href="../img/favicon.ico" type="img/x-icon">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/admin-lte/2.4.3/css/AdminLTE.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.css">
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
    <link rel="stylesheet" href="../css/_all-skins.min.css">
    <link rel="stylesheet" href="../css/app.css">
    <link rel="stylesheet" href="../css/_nightmode.min.css">
</head>
<body class="hold-transition skin-blue sidebar-mini fixed">
    <div class="wrapper">
        <!-- Header -->
        <header class="main-header">
            <!-- Logo -->
            <a href="javascript:void(0)" class="logo">
                <span class="logo-mini"><b>A</b>SF</span>
                <span class="logo-lg"><b>Archi</b>SteamFarm</span>
            </a>

            <nav class="navbar navbar-static-top" role="navigation">
                <!-- Left Sidebar Toggle Button-->
                <a href="javascript:void(0)" class="sidebar-toggle" id="leftSidebar" data-toggle="push-menu" role="button">
                    <i class="fas fa-bars"></i>
                    <span class="sr-only" data-i18n="global-navigation">Toggle navigation</span>
                </a>
                <div class="navbar-custom-menu">
                    <ul class="nav navbar-nav">
                        <!-- Right Sidebar Toggle Button -->
                        <li><a href="javascript:void(0)" data-toggle="control-sidebar"><i class="fas fa-cogs"></i></a></li>
                    </ul>
                </div>
            </nav>
        </header>

        <!-- Left Sidebar -->
        <aside class="main-sidebar">
            <section class="sidebar">
                <ul class="sidebar-menu" data-widget="tree">
                    <li class="header" data-i18n="global-home">Home</li>
                    <li><a href="commands.html"><i class="fas fa-laptop fa-fw"></i> <span data-i18n="global-commands">Commands</span></a></li>
                    <li class="active">
                        <a href="bots.html">
                            <i class="fas fa-users fa-fw"></i> <span data-i18n="global-bots">Bots</span>
                            <span class="pull-right-container bot-status">
                                <small class="label pull-right bg-gray" id="offlineBots">0</small>
                                <small class="label pull-right bg-yellow" id="onlineBots">0</small>
                                <small class="label pull-right bg-olive" id="farmingBots">0</small>
                            </span>
                        </a>
                    </li>
                    <li><a href="log.html"><i class="far fa-file-alt fa-fw"></i> <span data-i18n="global-log">Log</span></a></li>

                    <li class="header" data-i18n="global-config">Config</li>
                    <li><a href="editor.html"><i class="far fa-edit fa-fw"></i> <span data-i18n="global-editor">Editor</span></a></li>
                    <li><a href="generator.html"><i class="far fa-copy fa-fw"></i> <span data-i18n="global-generator">Generator</span></a></li>

                    <li class="header" data-i18n="global-information">Information</li>
                    <li class="info-overview">
                        <a>
                            <i class="fas fa-tachometer-alt fa-fw"></i> <span data-i18n="global-ram-usage">RAM Usage</span>
                            <span class="pull-right-container">
                                <small class="label pull-right bg-blue" id="ramUsage">0.00 MB</small>
                            </span>
                        </a>
                    </li>
                    <li class="info-overview">
                        <a>
                            <i class="far fa-clock fa-fw"></i> <span data-i18n="global-uptime">Uptime</span>
                            <span class="pull-right-container">
                                <small class="label pull-right bg-blue" id="uptime">0d 0h 0m</small>
                            </span>
                        </a>
                    </li>
                </ul>
            </section>
        </aside>

        <!-- Content -->
        <div class="content-wrapper">
            <section class="content-header">
                <h1>
                    <span data-i18n="global-bots">Bots</span>
                    <small data-i18n="global-control-panel">Control Panel</small>
                </h1>
                <ol class="breadcrumb">
                    <li><i class="fas fa-home"></i> <span data-i18n="global-home">Home</span></li>
                    <li class="active"><i class="fas fa-users"></i> <span data-i18n="global-bots">Bots</span></li>
                </ol>
            </section>

            <!-- Content Body -->
            <section class="content container-fluid">
                <div class="box collapsed-box" id="headerBox">
                    <div class="box-header with-border">
                        <i class="fas fa-users"></i>
                        <h3 class="box-title" data-i18n="global-bots">Bots</h3>
                        <div class="box-tools pull-right">
                            <div class="btn-group">
                                <button type="button" class="btn btn-box-tool dropdown-toggle" data-toggle="dropdown">
                                    <span data-i18n="bots-hide">Hide bots</span> <span class="fas fa-caret-down"></span>
                                </button>
                                <ul class="dropdown-menu" role="menu">
                                    <li><button data-i18n="title-bots-online" title="Toggle online bots" type="button" class="btn btn-box-tool text-grey" id="chkHideOnlineBots"><i id="iconHideOnlineBots" class="fas fa-toggle-on fa-2x fa-rotate-180"></i></button><span data-i18n="bots-hide-online">Online bots</span></li>
                                    <li><button data-i18n="title-bots-offline" title="Toggle offline bots" type="button" class="btn btn-box-tool text-grey" id="chkHideOfflineBots"><i id="iconHideOfflineBots" class="fas fa-toggle-on fa-2x fa-rotate-180"></i></button><span data-i18n="bots-hide-offline">Offline bots</span></li>
                                </ul>
                            </div>
                            <button data-i18n="title-bots-refresh" title="Refresh content" type="button" class="btn btn-box-tool" id="btnRefreshContent"><i class="fas fa-sync"></i></button>
                            <div class="btn-group">
                                <button type="button" class="btn btn-box-tool dropdown-toggle" data-toggle="dropdown">
                                    <i class="fas fa-wrench"></i>
                                </button>
                                <ul class="dropdown-menu" role="menu">
                                    <li><button data-i18n="title-bots-key" title="Toggle key button" type="button" class="btn btn-box-tool text-grey" id="chkShowKeyButton"><i id="iconShowKeyButton" class="fas fa-toggle-on fa-2x fa-rotate-180"></i></button><span data-i18n="bots-key">Show key button</span></li>
                                    <li><button data-i18n="title-bots-delete" title="Toggle delete button" type="button" class="btn btn-box-tool text-grey" id="chkShowDeleteButton"><i id="iconShowDeleteButton" class="fas fa-toggle-on fa-2x fa-rotate-180"></i></button><span data-i18n="bots-delete">Show delete button</span></li>
                                    <li><button data-i18n="title-bots-simple" title="Toggle simple farming info" type="button" class="btn btn-box-tool text-grey" id="chkSimpleFarmingInfo"><i id="iconSimpleFarmingInfo" class="fas fa-toggle-on fa-2x fa-rotate-180"></i></button><span data-i18n="bots-simple">Simple farming info</span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row" id="totalBotOverview"></div>
                <div class="row" id="botRow"></div>
            </section>
        </div>

        <!-- Footer -->
        <footer class="main-footer">
            <div class="pull-right"><strong data-i18n="global-version">Version</strong> <span id="version">0.0.0.0</span></div>
            <strong>
                <a target="_blank" href="https://github.com/JustArchi/ArchiSteamFarm">GitHub</a> -
                <a target="_blank" href="https://github.com/JustArchi/ArchiSteamFarm/wiki"><span data-i18n="global-wiki">Wiki</span></a> -
                <a target="_blank" href="https://github.com/JustArchi/ArchiSteamFarm/commits/master" id="changelog"><span data-i18n="global-changelog">Changelog</span></a>
            </strong>
        </footer>

        <!-- Right Sidebar -->
        <aside class="control-sidebar control-sidebar-dark">
            <div class="tab-content">
                <div class="tab-pane" id="control-right-sidebar"></div>
            </div>
        </aside>

        <div class="control-sidebar-bg"></div>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-sweetalert/1.0.1/sweetalert.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/admin-lte/2.4.3/js/adminlte.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.8.1/slick.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/humanize-duration/3.12.1/humanize-duration.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.20.1/moment.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.i18n/1.0.4/jquery.i18n.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.i18n/1.0.4/jquery.i18n.messagestore.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.i18n/1.0.4/jquery.i18n.fallbacks.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.i18n/1.0.4/jquery.i18n.language.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.i18n/1.0.4/jquery.i18n.parser.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.i18n/1.0.4/jquery.i18n.emitter.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.i18n/1.0.4/jquery.i18n.emitter.bidi.min.js"></script>
    <script src="../js/utils.js"></script>
    <script src="../js/i18n.js"></script>
    <script src="../js/app.js"></script>
    <script>
        $(function () {
            'use strict';

            store('CurrentPage', 'pages/bots.html');

            var tmpHideOnlineBots = get('hideOnlineBots'),
                tmpHideOfflineBots = get('hideOfflineBots'),
                tmpShowDeleteButton = get('showDeleteButton'),
                tmpShowKeyButton = get('showKeyButton'),
                tmpSimpleFarmingInfo = get('simpleFarmingInfo'),
                currentlySelectedBots = [];

            $(document).delegate('#gamesToRedeemInBackground', 'keydown', function (e) {
                var keyCode = e.keyCode || e.which;

                if (keyCode == 9) {
                    e.preventDefault();
                    e.stopImmediatePropagation();
                    var start = this.selectionStart;
                    var end = this.selectionEnd;
                    
                    $(this).val($(this).val().substring(0, start) // set textarea value to: text before caret + tab + text after caret
                        + "\t"
                        + $(this).val().substring(end));
                    
                    this.selectionStart = this.selectionEnd = start + 1; // put caret at right position again
                }
            });

            $(document).delegate('#delimeter', 'keydown', function (e) {
                var keyCode = e.keyCode || e.which;

                if (keyCode == 9) {
                    e.preventDefault();
                    e.stopImmediatePropagation();
                    var start = this.selectionStart;
                    var end = this.selectionEnd;
                    
                    $(this).val($(this).val().substring(0, start) // set textarea value to: text before caret + tab + text after caret
                        + "\t"
                        + $(this).val().substring(end));
                    
                    this.selectionStart = this.selectionEnd = start + 1; // put caret at right position again
                }
            });
            
            $('.box-tools').ready(function () { // Load state of checkboxes
                if (tmpHideOnlineBots === 'true') {
                    $('#chkHideOnlineBots').removeClass('text-grey');
                    $('#chkHideOnlineBots').addClass('text-olive');
                    $('#iconHideOnlineBots').removeClass('fa-rotate-180');
                }

                if (tmpHideOfflineBots === 'true') {
                    $('#chkHideOfflineBots').removeClass('text-grey');
                    $('#chkHideOfflineBots').addClass('text-olive');
                    $('#iconHideOfflineBots').removeClass('fa-rotate-180');
                }

                if (tmpHideOnlineBots !== 'true' || tmpHideOfflineBots !== 'true') loadPageContent();

                if (tmpShowDeleteButton === 'true') {
                    $('#chkShowDeleteButton').removeClass('text-grey');
                    $('#chkShowDeleteButton').addClass('text-olive');
                    $('#iconShowDeleteButton').removeClass('fa-rotate-180');
                }

                if (tmpShowKeyButton === 'true') {
                    $('#chkShowKeyButton').removeClass('text-grey');
                    $('#chkShowKeyButton').addClass('text-olive');
                    $('#iconShowKeyButton').removeClass('fa-rotate-180');
                }

                if (tmpShowKeyButton === 'true') {
                    $('#chkShowKeyButton').removeClass('text-grey');
                    $('#chkShowKeyButton').addClass('text-olive');
                    $('#iconShowKeyButton').removeClass('fa-rotate-180');
                }

                if (tmpSimpleFarmingInfo === 'true') {
                    $('#chkSimpleFarmingInfo').removeClass('text-grey');
                    $('#chkSimpleFarmingInfo').addClass('text-olive');
                    $('#iconSimpleFarmingInfo').removeClass('fa-rotate-180');
                }
            });

            $('#chkSimpleFarmingInfo').click(function () {
                if ($('#iconSimpleFarmingInfo').hasClass('fa-rotate-180')) {
                    $('#iconSimpleFarmingInfo').removeClass('fa-rotate-180');
                    $('#chkSimpleFarmingInfo').removeClass('text-grey');
                    $('#chkSimpleFarmingInfo').addClass('text-olive');
                    store('simpleFarmingInfo', true);
                } else {
                    $('#iconSimpleFarmingInfo').addClass('fa-rotate-180');
                    $('#chkSimpleFarmingInfo').removeClass('text-olive');
                    $('#chkSimpleFarmingInfo').addClass('text-grey');
                    store('simpleFarmingInfo', false);
                }
                loadPageContent();
            });

            $('#chkHideOnlineBots').click(function () {
                if ($('#iconHideOnlineBots').hasClass('fa-rotate-180')) {
                    $('#iconHideOnlineBots').removeClass('fa-rotate-180');
                    $('#chkHideOnlineBots').removeClass('text-grey');
                    $('#chkHideOnlineBots').addClass('text-olive');
                    store('hideOnlineBots', true);
                } else {
                    $('#iconHideOnlineBots').addClass('fa-rotate-180');
                    $('#chkHideOnlineBots').removeClass('text-olive');
                    $('#chkHideOnlineBots').addClass('text-grey');
                    store('hideOnlineBots', false);
                }
                loadPageContent();
            });

            $('#chkHideOfflineBots').click(function () {
                if ($('#iconHideOfflineBots').hasClass('fa-rotate-180')) {
                    $('#iconHideOfflineBots').removeClass('fa-rotate-180');
                    $('#chkHideOfflineBots').removeClass('text-grey');
                    $('#chkHideOfflineBots').addClass('text-olive');
                    store('hideOfflineBots', true);
                } else {
                    $('#iconHideOfflineBots').addClass('fa-rotate-180');
                    $('#chkHideOfflineBots').removeClass('text-olive');
                    $('#chkHideOfflineBots').addClass('text-grey');
                    store('hideOfflineBots', false);
                }
                loadPageContent();
            });

            $('#btnRefreshContent').click(function () {
                $('#btnRefreshContent').blur();
                loadPageContent();
            });

            $('#chkShowDeleteButton').click(function () {
                if ($('#iconShowDeleteButton').hasClass('fa-rotate-180')) {
                    $('#iconShowDeleteButton').removeClass('fa-rotate-180');
                    $('#chkShowDeleteButton').removeClass('text-grey');
                    $('#chkShowDeleteButton').addClass('text-olive');
                    store('showDeleteButton', true);
                } else {
                    $('#iconShowDeleteButton').addClass('fa-rotate-180');
                    $('#chkShowDeleteButton').removeClass('text-olive');
                    $('#chkShowDeleteButton').addClass('text-grey');
                    store('showDeleteButton', false);
                }
                loadPageContent();
            });

            $('#chkShowKeyButton').click(function () {
                if ($('#iconShowKeyButton').hasClass('fa-rotate-180')) {
                    $('#iconShowKeyButton').removeClass('fa-rotate-180');
                    $('#chkShowKeyButton').removeClass('text-grey');
                    $('#chkShowKeyButton').addClass('text-olive');
                    store('showKeyButton', true);
                } else {
                    $('#iconShowKeyButton').addClass('fa-rotate-180');
                    $('#chkShowKeyButton').removeClass('text-olive');
                    $('#chkShowKeyButton').addClass('text-grey');
                    store('showKeyButton', false);
                }
                loadPageContent();
            });

            function loadPageContent() {
                var tmpHideOnlineBots = get('hideOnlineBots'),
                    tmpHideOfflineBots = get('hideOfflineBots'),
                    tmpShowDeleteButton = get('showDeleteButton'),
                    tmpDelimeter = get('delimeter'),
                    tmpShowKeyButton = get('showKeyButton'),
                    tmpSimpleFarmingInfo = get('simpleFarmingInfo');
                
                $('#totalBotOverview').empty(); // Clear page content
                $('#botRow').empty(); // Clear page content

                if (!tmpDelimeter) {
                    tmpDelimeter = '\t';
                }

                $.ajax({
                    url: '/Api/Bot/ASF',
                    type: 'GET',
                    success: function (data) {
                        var json = data['Result'],
                            steamAvatarBaseURL = 'https://steamcdn-a.akamaihd.net/steamcommunity/public/images/avatars/',
                            steamGameBaseURL = 'http://cdn.edgecast.steamstatic.com/steam/apps/',
                            totalGamesRemaining = 0,
                            totalTimeRemaining = '00:00:00',
                            totalCardsRemaining = 0,
                            farmingIsActive = false;

                        var deleteBotHTML = tmpShowDeleteButton === 'true' ? '<button data-i18n="title-bots-delete-this" title="Delete this bot" type="button" class="btn btn-box-tool" data-command="deleteBot"><i class="far fa-trash-alt"></i></button>' : '';
                        var redeemGamesHTML = tmpShowKeyButton === 'true' ? '<button data-i18n="title-bots-games" title="Add keys to GamesToRedeemInBackground" type="button" class="btn btn-box-tool" data-command="redeemGames"><i class="fas fa-key"></i></button>' : '';

                        for (var i = 0; i < json.length; i++) {
                            var obj = json[i],
                                BotName = obj.BotName,
                                AvatarHash = obj.AvatarHash,
                                IsPlayingPossible = obj.IsPlayingPossible,
                                KeepRunning = obj.KeepRunning,
                                SteamID = obj.SteamID,
                                Paused = obj.CardsFarmer.Paused,
                                boxColorHTML = '',
                                avatarHTML = '',
                                profileHTML = '',
                                startOrStopHTML = '',
                                pauseOrResumeHTML = '',
                                expandBoxHTML = '',
                                allGamesHTML = '',
                                boxBodyHTML = '';

                            if (AvatarHash) {
                                var folder = AvatarHash.substring(0, 2);
                                avatarHTML = steamAvatarBaseURL + folder + '/' + AvatarHash + '.jpg';
                            } else {
                                avatarHTML = steamAvatarBaseURL + 'fe/fef49e7fa7e1997310d705b2a6158ff8dc1cdfeb.jpg';
                            }
							
							profileHTML = '<img src="' + avatarHTML + '">';

                            if (KeepRunning === false) { // Bot is offline
                                if (tmpHideOfflineBots === 'true') continue;
                                boxColorHTML = 'box-gray';
                                startOrStopHTML = '<button title="Start <' + BotName + '>" type="button" class="btn btn-box-tool bot-stopped" data-command="startBot"><i class="fas fa-power-off"></i></button>';
                            } else { // Bot is idling
                                if (tmpHideOnlineBots === 'true') continue;
                                boxColorHTML = 'box-warning';
                                startOrStopHTML = '<button title="Stop <' + BotName + '>" type="button" class="btn btn-box-tool bot-started" data-command="stopBot"><i class="fas fa-power-off"></i></button>';

                                var TimeRemaining = obj.CardsFarmer.TimeRemaining;

                                if (SteamID === 0) { // Bot is not connected to steam
                                    boxColorHTML = 'box-danger';
                                } else { // Bot is connected to steam
                                    profileHTML = '<a href="https://steamcommunity.com/profiles/' + obj.s_SteamID + '" target="_blank">'
                                        + '<img src="' + avatarHTML + '">'
                                        + '</a>';

                                    if (TimeRemaining !== '00:00:00') { // Bot is farming
                                        var GamesToFarm = obj.CardsFarmer.GamesToFarm,
                                            CurrentGamesFarming = obj.CardsFarmer.CurrentGamesFarming,
                                            allGamesFarmingAppID = [],
                                            allGamesFarmingName = [],
                                            allCardsRemaining = 0;

                                        farmingIsActive = true; // At least one bot is farming
                                        boxColorHTML = 'box-success';

                                        for (var j = 0; j < GamesToFarm.length; j++) {
                                            totalCardsRemaining = totalCardsRemaining + GamesToFarm[j].CardsRemaining;
                                            allCardsRemaining = allCardsRemaining + GamesToFarm[j].CardsRemaining;
                                        }

                                        for (var k = 0; k < CurrentGamesFarming.length; k++) {
                                            allGamesFarmingAppID.push(CurrentGamesFarming[k].AppID);
                                            allGamesFarmingName.push(CurrentGamesFarming[k].GameName);
                                        }

                                        if (totalTimeRemaining < TimeRemaining) totalTimeRemaining = TimeRemaining;

                                        totalGamesRemaining += GamesToFarm.length;

                                        expandBoxHTML = '<button data-i18n="title-bots-more" title="Show more infos" type="button" class="btn btn-box-tool" data-widget="collapse" id="collapse-trigger"><i class="fas fa-plus"></i></button>'

                                        if (IsPlayingPossible) {
                                            if (Paused) {
                                                allGamesHTML = '<p class="text-center no-margin">' + $.i18n('bots-paused') + '</p>';
                                            } else {
                                                if (tmpSimpleFarmingInfo === 'true') {
                                                    allGamesHTML = '<p class="text-center no-margin">' + allGamesFarmingName.join(", ") + '</p>';
                                                } else {
                                                    if (allGamesFarmingAppID.length === 1) {
                                                        var value = allGamesFarmingAppID;
                                                        allGamesHTML = '<img src="' + steamGameBaseURL + value[0] + '/header.jpg" alt="" class="img-responsive">'; // ToDo: Fill alt="" with gameName
                                                    } else { // Multiple game farming is active
                                                        allGamesHTML = '<div class="games-carousel-' + BotName + '">';

                                                        for (var appID in allGamesFarmingAppID) {
                                                            var value = allGamesFarmingAppID[appID];
                                                            allGamesHTML += '<div class="game-box" style="max-height: 215px;"><img src="' + steamGameBaseURL + value + '/header.jpg" alt="" class="img-responsive"></div>'; // ToDo: Fill alt="" with gameName
                                                        }

                                                        allGamesHTML += '</div>';
                                                    }
                                                }
                                            }
                                        } else {
                                            allGamesHTML = '<p class="text-center no-margin">' + $.i18n('bots-in-use') + '</p>';
                                        }

                                        TimeRemaining = moment.duration(TimeRemaining).asMilliseconds();

                                        boxBodyHTML = '<div class="box-body" id="' + BotName + '">'
                                            + '<div class="row">'
                                            + '<div class="col-lg-8 col-md-8 col-sm-8 col-xs-8">'
                                            + '<span class="pull-left"><i class="far fa-clock"></i> ' + humanizeDuration(TimeRemaining) + '</span>'
                                            + '</div>'
                                            + '<div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">'
                                            + '<span class="pull-right"><i class="far fa-clone"></i> ' + allCardsRemaining + '</span>'
                                            + '</div>'
                                            + '</div>'
                                            + allGamesHTML
                                            + '</div>'
                                    }
                                }

                                if (Paused) {
                                    pauseOrResumeHTML = '<button title="Resume <' + BotName + '>" type="button" class="btn btn-box-tool bot-paused" data-command="resumeBot"><i class="fas fa-pause"></i></button>';
                                } else {
                                    pauseOrResumeHTML = '<button title="Pause <' + BotName + '>" type="button" class="btn btn-box-tool bot-resumed" data-command="pauseBot"><i class="fas fa-pause"></i></button>';
                                }
                            }

                            $('#botRow').append('<div class="col-lg-3 col-md-4 col-sm-6 col-xs-12">'
                                + '<div class="box ' + boxColorHTML + ' collapsed-box" id="bot-box-' + BotName + '">'
                                + '<div class="box-header with-border botHeader ui-widget-content">'
								+ profileHTML
                                + '<h3 class="box-title botTitle">' + BotName + '</h3>'
                                + '<div class="box-tools pull-right botTools" id="' + BotName + '">'
                                + startOrStopHTML
                                + pauseOrResumeHTML
                                + redeemGamesHTML
                                + deleteBotHTML
                                + expandBoxHTML
                                + '</div>'
                                + boxBodyHTML
                                + '</div>'
                                + '</div>'
                                + '</div>');

                            $('#bot-box-' + BotName).boxWidget({
                                animationSpeed: 500,
                                collapseTrigger: '#collapse-trigger',
                                collapseIcon: 'fa-minus',
                                expandIcon: 'fa-plus',
                            })
                                .on('expanded.boxwidget', function (BotName) {
                                    var botCarousel = $('.games-carousel-' + BotName);
                                    
                                    if ($(botCarousel).hasClass('slick-initialized')) { // Check if Slick was already initialized
                                        $(botCarousel).slick('slickPlay'); // Slick is set up, so just resume the animation
                                    } else {
                                        $(botCarousel).slick({ // Set up Slick for the first time.
                                            slidesToShow: 1,
                                            draggable: true,
                                            autoplay: true,
                                            autoplaySpeed: 2000,
                                            arrows: false,
                                            infinite: true
                                        });
                                    }
                                }.bind(null, BotName))
                                .on('collapsed.boxwidget', function (BotName) {
                                    $('.games-carousel-' + BotName).slick('slickPause'); // Pause Slick's animation and collapse the menu
                                }.bind(null, BotName)
                            );

                            $('#bot-box-' + BotName + ' .btn').click(function () {
                                var BotName = $(this).parent().attr('id'),
                                    cmd = $(this).data('command'),
                                    $botBox = $('#bot-box-' + BotName);

                                if (typeof cmd === 'undefined') {
                                    return;
                                }

                                $botBox.append('<div class="overlay bot-box-loading"><i class="fas fa-sync fa-spin"></i></div>');

                                switch (cmd) {
                                    case 'startBot':
                                        $.ajax({
                                            url: '/Api/Command/start ' + encodeURIComponent(BotName),
                                            type: 'POST',
                                            success: function (data) {
                                                $('.overlay').remove();
                                                swal({
                                                    title: $.i18n('global-success-title'),
                                                    text: $.i18n('bots-start-success', BotName),
                                                    type: 'success'
                                                }, function () { location.reload(); });
                                            }
                                        });
                                        break;

                                    case 'stopBot':
                                        $.ajax({
                                            url: '/Api/Command/stop ' + encodeURIComponent(BotName),
                                            type: 'POST',
                                            success: function (data) {
                                                $('.overlay').remove();
                                                swal({
                                                    title: $.i18n('global-success-title'),
                                                    text: $.i18n('bots-stop-success', BotName),
                                                    type: 'success'
                                                }, function () { location.reload(); });
                                            }
                                        });
                                        break;

                                    case 'pauseBot':
                                        $.ajax({
                                            url: '/Api/Command/pause ' + encodeURIComponent(BotName),
                                            type: 'POST',
                                            success: function (data) {
                                                $('.overlay').remove();
                                                swal({
                                                    title: $.i18n('global-success-title'),
                                                    text: $.i18n('bots-pause-success', BotName),
                                                    type: 'success'
                                                }, function () { location.reload(); });
                                            }
                                        });
                                        break;

                                    case 'resumeBot':
                                        $.ajax({
                                            url: '/Api/Command/resume ' + encodeURIComponent(BotName),
                                            type: 'POST',
                                            success: function (data) {
                                                $('.overlay').remove();
                                                swal({
                                                    title: $.i18n('global-success-title'),
                                                    text: $.i18n('bots-resume-success', BotName),
                                                    type: 'success'
                                                }, function () { location.reload(); });
                                            }
                                        });
                                        break;

                                    case 'deleteBot':
                                        swal({
                                            title: $.i18n('global-question-title'),
                                            text: $.i18n('bots-recover-files'),
                                            type: 'warning',
                                            showCancelButton: true,
                                            confirmButtonClass: 'btn-danger',
                                            confirmButtonText: $.i18n('bots-confirm-delete'),
                                            closeOnConfirm: false,
                                            showLoaderOnConfirm: true
                                        }, function (isConfirm) {
                                            if (isConfirm) {
                                                $.ajax({
                                                    url: '/Api/Bot/' + encodeURIComponent(BotName),
                                                    type: 'DELETE',
                                                    success: function (data) {
                                                        $('.overlay').remove();
                                                        swal({
                                                            title: $.i18n('global-success-title'),
                                                            text: $.i18n('bots-delete-success', BotName),
                                                            type: 'success'
                                                        }, function () { location.reload(); });
                                                    }
                                                });
                                            } else {
                                                $('.overlay').remove();
                                            }                                            
                                        });
                                        break;

                                    case 'redeemGames':
                                        swal({
                                            title: $.i18n('bots-redeem-title'),
                                            text: '<p class="lead text-muted" style="display: block;">' + $.i18n('bots-syntax') + '</p>'
                                            + '<textarea id="gamesToRedeemInBackground"></textarea>'
                                            + '<div class="input-group">'
                                            + '<span class="input-group-addon" id="delimeter-text">' + $.i18n('bots-delimeter') + '</span>'
                                            + '<input type="text" class="form-control" id="delimeter" value="' + tmpDelimeter + '" aria-describedby="delimeter-text">'
                                            + '</div>',
                                            html: true,
                                            customClass: 'swal-wide',
                                            showCancelButton: true,
                                            confirmButtonClass: 'btn-success',
                                            confirmButtonText: $.i18n('bots-redeem-button'),
                                            closeOnConfirm: false,
                                            showLoaderOnConfirm: true
                                        }, function (isConfirm) {
                                            if (isConfirm === false) {
                                                $('.overlay').remove();
                                                return false;
                                            }
                                            var val = $('#gamesToRedeemInBackground').val();

                                            var _gamesToRedeemInBackground = {},
                                                gamesAndKeys = [],
                                                lines = val.split('\n'),
                                                currentDelimeter = $('#delimeter').val();

                                            store('delimeter', currentDelimeter);

                                            for (var i = 0; i < lines.length; i++) {
                                                if (lines[i] !== '') gamesAndKeys.push(lines[i].split(currentDelimeter));
                                            }

                                            for (var j = 0; j < gamesAndKeys.length; j++) {
                                                var obj = gamesAndKeys[j];
                                                _gamesToRedeemInBackground[obj[1]] = obj[0];
                                            }

                                            var ajaxData = { GamesToRedeemInBackground: _gamesToRedeemInBackground };

                                            $.ajax({
                                                url: '/Api/GamesToRedeemInBackground/' + encodeURIComponent(BotName),
                                                type: 'POST',
                                                data: JSON.stringify(ajaxData, null, "\t"),
                                                contentType: 'application/json',
                                                success: function (data) {
                                                    var obj = data['Result'],
                                                        gamesAdded = Object.keys(obj).length;

                                                    swal({
                                                        title: $.i18n('global-success-title'),
                                                        text: $.i18n('bots-redeem-confirm', gamesAdded, BotName),
                                                        type: 'success'
                                                    }, function () { location.reload(); });
                                                },
                                                error: function (jqXHR, textStatus, errorThrown) {
                                                    swal({
                                                        title: $.i18n('global-error-title'),
                                                        text: jqXHR.status + ' ' + errorThrown + ' - ' + jqXHR.responseJSON['Message'],
                                                        type: 'error'
                                                    }, function () { location.reload(); });
                                                }
                                            });

                                            $('.overlay').remove();
                                        });
                                        break;
                                }
                            })
                        }

                        if (farmingIsActive) { // Add info boxes if at least one bot is farming
                            $('#totalBotOverview').html('<div class="col-md-4 col-sm-4 col-xs-12">'
                                + '<div class="info-box bot-info-box">'
                                + '<span class="info-box-icon bg-purple bots-info-box-icon"><i class="fas fa-gamepad"></i></span>'
                                + '<div class="info-box-content bot-info-box-content">'
                                + '<span class="info-box-text">' + $.i18n('bots-infobox-games') + '</span>'
                                + '<span class="info-box-number" id="totalGamesRemaining"></span>'
                                + '</div>'
                                + '</div>'
                                + '</div>'
                                + '<div class="col-md-4 col-sm-4 col-xs-12">'
                                + '<div class="info-box bot-info-box">'
                                + '<span class="info-box-icon bg-green bots-info-box-icon"><i class="far fa-clock"></i></span>'
                                + '<div class="info-box-content bot-info-box-content">'
                                + '<span class="info-box-text">' + $.i18n('bots-infobox-time') + '</span>'
                                + '<span class="info-box-number" id="totalTimeRemaining"></span>'
                                + '</div>'
                                + '</div>'
                                + '</div>'
                                + '<div class="col-md-4 col-sm-4 col-xs-12">'
                                + '<div class="info-box bot-info-box">'
                                + '<span class="info-box-icon bg-aqua bots-info-box-icon"><i class="far fa-clone"></i></span>'
                                + '<div class="info-box-content bot-info-box-content">'
                                + '<span class="info-box-text">' + $.i18n('bots-infobox-cards') + '</span>'
                                + '<span class="info-box-number" id="totalCardsRemaining"></span>'
                                + '</div>'
                                + '</div>'
                                + '</div>');

                            totalTimeRemaining = moment.duration(totalTimeRemaining).asMilliseconds();

                            $('#totalGamesRemaining').text(totalGamesRemaining);
                            $('#totalTimeRemaining').text(humanizeDuration(totalTimeRemaining));
                            $('#totalCardsRemaining').text(totalCardsRemaining);
                        }
                    }
                });
            }
        })
    </script>
</body>
</html>
